<html>
  <head>
    <title>Search contacts</title>
    <meta content="">
  </head>
	<script src="static/js/jquery-1.4.4.min.js" type="text/javascript"></script>
	<script src="static/js/jquery.dataTables.min.js" type="text/javascript"></script>
	<style type="text/css" media="screen">
		@import "/static/css/site_jui.css";
		@import "/static/css/demo_table_jui.css";
		@import "/static/css/jquery-ui-1.7.2.custom.css";
		.dataTables_info { padding-top: 0; }
		.dataTables_paginate { padding-top: 0; }
		.css_right { float: right; }
		#contacts { width: 100% }
		#contacts_wrapper .fg-toolbar { font-size: 0.8em }
		#theme_links span { float: left; padding: 2px 10px; }
	</style>
	<script type="text/javascript">
		$(document).ready(function() {
			$('#contacts').dataTable({
				"bJQueryUI": true,
				"sPaginationType": "full_numbers",
				"aoColumns": [
					null,
					null,
					null,
					null,
					{ "bSortable": false, "bSearchable": false },
					{ "bSortable": false, "bSearchable": false }
				]
			});
		});
	</script>
  <body>
	<a href="/">Go to Home</a>
	<form method="get" action="search" >
		<fieldset>
			<legend>Search contacts</legend>
				<input type="text" name="text" value="{{ text }}"/>
				<input type="submit" value="Search">
		</fieldset>
	</form>
     {% if len(cursor) > 0 %}
     <table id="contacts">
         <thead>
            <th>Last name</th>
            <th>First name</th>
            <th>Phone</th>
            <th>E-mail</th>
            <th>&nbsp;</th>
            <th>&nbsp;</th>
         </thead>
         <tbody>
            {% for item in cursor %}
             <tr>
                 <td>{{ item[1] }}</td>
                 <td>{{ item[2] }}</td>
                 <td>{{ item[3] }}</td>
                 <td>{{ item[4] }}</td>
                 <td><a href="/delete/{{ item[0] }}">Delete</a></td>
                 <td><a href="/update/{{ item[0] }}">Update</a></td>
             </tr>
            {% end %}
         </tbody>
     </table>
     {% else %}
     <table id="contacts">
         <thead>
            <th>Last name</th>
            <th>First name</th>
            <th>Phone</th>
            <th>E-mail</th>
            <th>&nbsp;</th>
            <th>&nbsp;</th>
         </thead>
         <tbody>
         </tbody>
     </table>
     {% end %}
  </body>
</html>
